<html>

<head>
    <title>无线传感器web管理系统</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <link rel="stylesheet" href="../../css/reset.css" type="text/css" />
    <script src="../../js/ecgarts.js"></script>

    <style>
        html {
            background-color: #f6fbfc;
            margin: 10px;
            margin-bottom: 200px;
        }

        .row {
            width: 100%;
            height: 400px;
        }

        .row_box_graph {
            float: left;
            display: line-block;
            margin: 5px;
            height: 100%;
            box-sizing: border-box;
            background-color: #fff;
            box-shadow: 0 0 5px rgb(230, 230, 230);
        }

        .row_box_graph_title {
            line-height: 45px;
            padding-left: 15px;
            color: #5f5f5f;
        }

        .row_box_graph_echarts {
            width: 100%;
            height: calc(100% - 60px);
        }

        .row_box_graph_content{
            padding: 10px 20px;
            line-height: 30px;
            color:#5f5f5f;
        }

        .line {
            height: 1px;
            width: 100%;
            background: #eee;
        }

        .row_title {
            margin: 5px;
            padding-left: 20px;
            width: calc(100%-30px);
            line-height: 50px;
            height: 50px;
            background-color: #fff;
            color: #5f5f5f;
            box-shadow: 0px 0px 10px rgb(224, 224, 224);
        }

        .title {
            height: 60px;
        }
    </style>
</head>

<body>
    <div class="row title">
        <div class="row_title">当前位置：首页</span></div>
    </div>

    <div class="row pc">
        <div class="row">
            <div class="row_box_graph" style="width:calc(33% - 10px)">
                <p class="row_box_graph_title">历史数据</p>
                <div class="line"></div>
                <div>
                    <div class="row_box_graph_echarts" id="echarts1"></div>
                </div>

            </div>
            <div class="row_box_graph" style="width:calc(33% - 10px)">
                <p class="row_box_graph_title">设备温度计</p>
                <div class="line"></div>
                <div class="row_box_graph_echarts" id="echarts2"></div>
            </div>
            <div class="row_box_graph" style="width:calc(33% - 10px)">
                <p class="row_box_graph_title">内存分配</p>
                <div class="line"></div>
                <div class="row_box_graph_echarts" id="echarts3"></div>
            </div>
        </div>

        <div class="row">
            <div class="row_box_graph" style="width:calc(75% - 10px)">
                <p class="row_box_graph_title">传感器历史层叠图</p>
                <div class="line"></div>
                <div class="row_box_graph_echarts" id="echarts4"></div>
            </div>

            <div class="row_box_graph" style="width:calc(25% - 10px)">
                <p class="row_box_graph_title">设备温度计</p>
                <div class="line"></div>
                <div class="row_box_graph_content">
                在这里，您可以查看节点一的环境信息实时数据！包括温度，湿度，光照，adc等以及仓库的设备状态。
                </div>
            </div>
        </div>


    </div>
    <script src="./js/template.js"></script>
    <script src="./js/zhexian.js"></script>
    <script src="./js/pingtu.js"></script>
    <script src="./js/duidie.js"></script>
    <script src="./js/index.js"></script>

</body>

</html>